<template>
  <div
    class="site-wrapper"
    :class="{ 'site-sidebar--fold': sidebarFold }"
    v-loading.fullscreen.lock="loading"
    element-loading-text="拼命加载中"
  >
    <template v-if="!loading">
      <main-navbar />
      <main-sidebar />
      <div
        class="site-content__wrapper"
        :style="{ 'min-height': documentClientHeight + 'px' }"
      >
        <main-content v-if="!$store.state.common.contentIsNeedRefresh" />
      </div>
    </template>
  </div>
</template>

<script>
import MainNavbar from './main-navbar'
import MainSidebar from './main-sidebar'
import MainContent from './main-content'
import { myEnumsMixins } from '@/utils/mixins'
import { userRefreshToken } from '@/api/user.js'
export default {
  provide () {
    return {
      // 刷新
      refresh () {
        this.$store.commit('common/updateContentIsNeedRefresh', true)
        this.$nextTick(() => {
          this.$store.commit('common/updateContentIsNeedRefresh', false)
        })
      }
    }
  },
  data () {
    return {
      loading: true
    }
  },
  mixins: [myEnumsMixins],
  components: {
    MainNavbar,
    MainSidebar,
    MainContent
  },
  computed: {
    documentClientHeight: {
      get () {
        return this.$store.state.common.documentClientHeight
      },
      set (val) {
        this.$store.commit('common/updateDocumentClientHeight', val)
      }
    },
    sidebarFold: {
      get () {
        return this.$store.state.common.sidebarFold
      }
    },
    userId: {
      get () {
        return this.$store.state.user.id
      },
      set (val) {
        this.$store.commit('user/updateId', val)
      }
    },
    userName: {
      get () {
        return this.$store.state.user.name
      },
      set (val) {
        this.$store.commit('user/updateName', val)
      }
    }
  },
  created () {
    this.getUserInfo()
    if (top.testingTokenTimeFn) {
      this.testingToken()
    }
  },
  mounted () {
    this.resetDocumentClientHeight()
  },
  methods: {
    // 重置窗口可视高度
    resetDocumentClientHeight () {
      this.documentClientHeight = document.documentElement['clientHeight']
      window.onresize = () => {
        this.documentClientHeight = document.documentElement['clientHeight']
      }
    },
    // 每5分钟请求刷新当前token是否过期
    testingToken () {
      top.testingTokenTimeFn = setTimeout(() => {
        let newTime = new Date().getTime() - 60 * 60 * 1000
        let tokenEnd = +localStorage.getItem('tokenEnd')
        if (tokenEnd - newTime < 0) {
          userRefreshToken({
            refreshToken: localStorage.getItem('refreshToken')
          }).then(res => {
            if (res[0]) {
              return
            }
            let data = res[1]
            this.$cookie.set('token', data.data.accessToken)
            localStorage.setItem(
              'tokenEnd',
              data.data.expire * 1000 + new Date().getTime()
            )
            localStorage.setItem('token', data.data.accessToken)
            localStorage.setItem('refreshToken', data.data.refreshToken)
          })
        } else {
          // console.log(11);
          this.testingToken()
        }
      }, 10 * 60 * 1000)
    },
    // 获取当前管理员信息
    getUserInfo () {
      this.$http({
        url: this.$http.adornUrl('/usercenter/sys/user/info'),
        method: 'get',
        params: this.$http.adornParams()
      }).then(({ data }) => {
        if (data && data.code === 0) {
          this.loading = false
          this.userId = data.user.userId
          this.userName = data.user.username
        }
      })
    }
  }
}
</script>
